<template>
	<div id="main1"></div>
</template>

<script>
// 引入Echarts
import * as echarts from 'echarts';

export default {
	name: 'VisualV1',
	mounted() {
		// 基于准备好的dom，初始化echarts实例
		let myChart = echarts.init(document.getElementById('main1'));
		// 绘制图表
		myChart.setOption({
			tooltip: {
				trigger: 'axis'
			},
			legend: {
				data: ['订单数量', '会员数量',]
			},
			grid: {
				left: '3%',
				right: '4%',
				bottom: '3%',
				containLabel: true
			},
			toolbox: {
				feature: {
					saveAsImage: {}
				}
			},
			xAxis: {
				type: 'category',
				boundaryGap: false,
				data: ['星期一', '星期二', '星期三', '星期四', '星期五', '星期六', '星期天']
			},
			yAxis: {
				type: 'value'
			},
			series: [
				{
					name: '订单数量',
					type: 'line',
					stack: 'Total',
					data: [120, 132, 101, 134, 90, 230, 210]
				},
				{
					name: '会员数量',
					type: 'line',
					stack: 'Total',
					data: [220, 182, 191, 234, 290, 330, 310]
				}
			]
		});
	}
}
</script>

<style>
#main1 {
	width: 500px;
	height: 400px;
	margin: 40px;
}
</style>